'use client';

// RHF
import { useFormContext } from 'react-hook-form';

import { useInvoiceContext } from '@/context/InvoiceContext';

// ShadCn
import { Form } from '@/components/ui/form';

import { InvoiceType } from '@/types';

//
import { InvoiceForm } from './InvoiceForm';
import { InvoiceActions } from './InvoiceActions';

const InvoiceMain = () => {
    const { handleSubmit } = useFormContext<InvoiceType>();

    // Get the needed values from invoice context
    const { onFormSubmit } = useInvoiceContext();

    return (
        <Form {...useFormContext<InvoiceType>()}>
            <form
                onSubmit={handleSubmit(onFormSubmit, (err) => {
                    console.log(err);
                })}
            >
                <div className="flex flex-wrap">
                    <InvoiceForm />
                    <InvoiceActions />
                </div>
            </form>
        </Form>
    );
};

export {
    //
    InvoiceMain,
};
